<template lang="html">
  <div class="home_nav">
    <div class="home_nav_item" v-for="(item, k) in nav_list" v-bind:key="k">
      <div class="nav_item_icon">
        <img class="icon_img" v-bind:src="item.button_logo"/>
        <span class="new_personal" v-if="item.button_sub_logo"><img class="tag_icon" v-bind:src="item.button_sub_logo" /></span>
      </div>
      <span class="nav_item_txt">{{item.button_name}}</span>
      <div class="nav_mask" @click="navClick(item)"></div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      nav_list: {}
    }
  },
  created () {
    this.getNavList()
  },
  methods: {
    getNavList () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'button_menu', params: { status: 1, location_code: 'TOP', sort: 'priority' }, method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.nav_list = resp.data.list
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    navClick (item) {
      if (item && item.h5_link) {
        window.location.href = item.h5_link
      }
    }
  }
}
</script>

<style lang="css" scoped>

</style>
